<template>
	<view style="width: 100vw;height: 100vh;" class="bg-white">
		<!-- 顶部按钮 -->
		<view class="cu-custom" :style="[{height:CustomBar + 'px'}]">
			<view class="cu-bar fixed flex justify-between align-center" :style="{height:CustomBar+'px',paddingTop:StatusBar+'px'}" style="font-size: 32rpx;" >
				<text class=" cuIcon-back margin-left" @click="back" style="font-size: 40rpx;"></text>
			</view>
		</view>
		<view style="margin-top: 24rpx; padding: 0 32rpx; line-height: 64rpx;">
			<textarea v-model="goods.title" style="color: #131415;font-size: 40rpx;font-weight: bold;" auto-height
				placeholder="请输入商品名称（5-30个字）" maxlength="30" placeholder-style="font-size: 40rpx;color: #999999;" />
		</view>
		<!-- 商品封面 -->
		<view style="margin-top: 40rpx; padding: 0 32rpx; ">
			<uni-file-picker fileMediatype="image" mode="grid" limit="1" :auto-upload="false" :value="goods.cover?[{url:goods.cover}]:[]"
				@select="selectImg" @delete="deleteCover" title="最多选择1张封面图 *"
				:image-styles="{height:'200rpx', width: '200rpx'}">
			</uni-file-picker>
		</view>
		<!-- 商品价格 -->
		<view style="margin-top: 24rpx; padding: 0 32rpx; line-height: 64rpx;font-size: 34rpx;color: #E03997;" class="flex align-center">
			价格：<input v-model="goods.price" placeholder="请输入价格" maxlength="10"></input>￥
		</view>
		<!-- 完成按钮 -->
		<button class="cu-btn  bg-blue" style="width: 30%; ;margin: 24rpx;position: absolute;bottom: 45%;right: 0;"
		 @click="addLink">完成</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				goods:{
					title:"",
					cover:"",
					price:""
				},
				uploadUrl: "http://xuewenbao.cn:38880/xwb/edu/file/uploadOSS",
			}
		},
		onLoad() {
          if(uni.getStorageSync('goods')){
			  this.goods=uni.getStorageSync('goods')
		  }
		},
		methods:{
			//上传封面
			async selectImg(e) {
				console.log(e)
				uni.showLoading({
					title: '正在上传中...'
				})
				for (let temp of e.tempFiles) {
					// 图片上传服务器
					await uni.uploadFile({
						url: this.uploadUrl,
						filePath: temp.path,
						name: "file",
						formData: {
							'biz': 'cover'
						},
						success: res => {
							//上传完成后处理
							let data = JSON.parse(res.data)
							if (data.success) {
								console.log("cover上传成功", data.message)
								this.goods.cover=data.message
							} else {
								console.log("cover上传失败", data.message)
							}
							uni.hideLoading()
						},
			
					});
				}
			},
			addLink(){
				this.saveGoods()
				this.$Router.back(1)
			},
			// 保存好物数据本地存储
			saveGoods(){
				uni.setStorageSync('goods',this.goods)
			},
			back(){
			if(this.goods.title ||this.goods.cover || this.goods.price){
				this.$tip.confirm("是否保存好物链接？", true).then(() => {
					this.saveGoods()
					this.$Router.back(1)
				}, () => {
					if(uni.getStorageSync('goods')){
						uni.removeStorageSync('goods')
					}
					this.$Router.back(1)
				});	
			}
			else{
				this.$Router.back(1)
			}	
			}
		}
	}
</script>

<style>
</style>
